<template>
  <div class="c_item" v-for="(item, index) in infoList" :key="'index'">
    <a-tag color="#55acee">
      <template #icon>
        <component :is="item.icon"></component>
      </template>
      {{ item.no + "-" + item.name }}
    </a-tag>
    <div class="ci_item" v-if="item.children && item.children.length > 0">
      <demo18_child :infoList="item.children"></demo18_child>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { ref, reactive } from "vue";

const data = defineProps(["infoList"]);
</script>

<style scoped lang="scss">
.c_item {
  margin-bottom: 10px;
  padding-left: 10px;
  .ci_item{
    margin-top: 10px;
  }
}
</style>
